﻿<!DOCTYPE html>
<html lang="en">
	{{include 'admin/public/header.html'}}

	<body>
		{{include 'admin/public/nav_top.html'}}

		<div class="main-container" id="main-container">
			<script type="text/javascript">
				try{ace.settings.check('main-container' , 'fixed')}catch(e){}
			</script>

			<div class="main-container-inner">
				<a class="menu-toggler" id="menu-toggler" href="#">
					<span class="menu-text"></span>
				</a>

				{{include 'admin/public/nav_left.html'}}

				<div class="main-content">
					<div class="breadcrumbs" id="breadcrumbs">
						<script type="text/javascript">
							try{ace.settings.check('breadcrumbs' , 'fixed')}catch(e){}
						</script>

						<ul class="breadcrumb">
							<li>
								<i class="iconfont">&#xe616;</i>
								<a href="#">首页</a>
							</li>
							<li class="active">控制台</li>
						</ul><!-- .breadcrumb -->

						<div class="nav-search" id="nav-search">
							<form class="form-search">
								<span class="input-icon">
									<input type="text" placeholder="Search ..." class="nav-search-input" id="nav-search-input" autocomplete="off" />
									<i class="icon-search nav-search-icon"></i>
								</span>
							</form>
						</div><!-- #nav-search -->
					</div>

					<div class="page-content">
						<div class="page-header">
							<h1>
								控制台
								<small>
									<i class="icon-double-angle-right"></i>
									 查看
								</small>
							</h1>
						</div><!-- /.page-header -->

						<div class="row">
							<div class="col-xs-12">
								<!-- PAGE CONTENT BEGINS -->

								<div class="alert alert-block alert-success" style="font-size: 30px;">
									<button type="button" class="close" data-dismiss="alert">
										<i class="icon-remove"></i>
									</button>

									<i class="icon-ok green" style="font-size: 30px;"></i>

									欢迎使用
									<strong class="green" style="font-size: 30px;">
									人人码软件服务平台官方网站后台管理系统
										<small>(v1.2)</small>
									</strong>
									,轻量级好用的后台管理系统。	
								</div>

                <!-- 数据可视化 -->
                <div id="echart" style="width: 800px;height:600px;margin:  0 auto;"></div>
                
							</div><!-- /.col -->
						</div><!-- /.row -->
					</div><!-- /.page-content -->
				</div><!-- /.main-content -->

			
			</div><!-- /.main-container-inner -->

			<a href="#" id="btn-scroll-up" class="btn-scroll-up btn btn-sm btn-inverse">
				<i class="icon-double-angle-up icon-only bigger-110"></i>
			</a>
		</div><!-- /.main-container -->


		{{include 'admin/public/footer.html'}}
    <script>
        var chartDom = document.getElementById('echart');
        window.onresize = function () {
            chartDom.resize();
        };
        var myChart = echarts.init(chartDom);
        var option;

        option = {
            legend: {
                top: 'bottom'
            },
            
            toolbox: {
                show: true,
                feature: {
                    mark: { show: true },
                    dataView: { show: true, readOnly: false },
                    restore: { show: true },
                    saveAsImage: { show: true }
                }
            },
            series: [
                {
                    name: '面积模式',
                    type: 'pie',
                    radius: [50, 250],
                    center: ['50%', '50%'],
                    roseType: 'area',
                    itemStyle: {
                        borderRadius: 8
                    },
                    data: [
                        { value: 40, name: '文章资讯' },
                        { value: 38, name: '轮播图' },
                        { value: 32, name: '导航栏' },
                        { value: 30, name: '内容分类' },
                        { value: 28, name: '管理员' },
                        { value: 26, name: '友情链接' },
                    ]
                }
            ]
        };
        option && myChart.setOption(option);
    </script>
	
</body>
</html>

